// pages/bbhj_show_map/bbhj_show_map.js
import {
  host
} from '../../config'
import * as echarts from '../../ec-canvas/echarts';
let chart = null;
var app = getApp();
let that = null;

function initChart(canvas, width, height, dpr) {
  chart = echarts.init(canvas, null, {
    width: width,
    height: height,
    devicePixelRatio: dpr // new
  });
  canvas.setChart(chart);
  // 从这里开始copy onshow里面的代码
  var report_array = new Array();
  console.log(app.globalData.openid, app.globalData.local_report)
  // 如果有openid，那就不看local_report了
  if (app.globalData.openid) {
    report_array = app.globalData.db_array;
  }
  // 如果没有openid，看看有没有local_report
  else if (app.globalData.local_report) {
    report_array[0] = app.globalData.local_report;
  }
  console.log('报告列表', report_array);
  that.setData({
    report_array: report_array
  })
  console.log('真的有报告吗？？', report_array)

  // 如果没有报告，就返回
  if (report_array.length == 0) {
    var data = [{
      value: 100,
      name: '暂无图表'
    }];
  } else {
    that.setData({
      report_choose: report_array[0],
      report_choose_index: 0
    })
    // 如果有报告，就选择默认第一个为展示的报告
    var data = []
    var report_choose = that.data.report_choose.report;
    console.log('要开始循环', report_choose);
    var index = 0;
    for (var key in report_choose) {
      var value = Math.floor(parseFloat(report_choose[key].prob) * 10000) / 100;
      data[index] = {
        value: value,
        name: report_choose[key].city + value.toString() + '%'
      }
      index += 1;
      if (index >= 5) {
        break
      }
    }
    console.log(data)

  }


  var option = {
    backgroundColor: "#ffffff",
    series: [{
      label: {
        normal: {
          fontSize: 14
        }
      },
      type: 'pie',
      center: ['50%', '50%'],
      radius: ['20%', '40%'],
      data: data
    }]
  };
  // 初始化
  console.log('初始化图表');
  chart.setOption(option);
  chart.on('mousedown', function (params) {
    // 控制台打印城市的名称
    console.log(params.name);
    var city = params.name;
    if (city == '暂无图表') {
      return;
    }
    wx.request({
      url: host + 'area_boundary',
      data: {
        city: city, // 需要显示的城市
      },
      method: 'get',
      header: {
        'Content-Type': 'application/json'
      },
      success: function (res) {

        // 解析返回的json数据
        var response_data = JSON.parse(res.data);
        // 返回值为8000的时候表示找到城市了，否则就是没找到，就不变了
        console.log(response_data);
        if (response_data.code == 8000) {
          // 城市经纬度坐标
          var points = response_data.message.board_list;
          // 城市中心点的坐标
          var lng = response_data.message.city_center.longitude;
          var lat = response_data.message.city_center.latitude;
          // 更新画图
          that.setData({
            longitude: lng,
            latitude: lat,
            polygon: [{
              points: points,
              fillColor: "#4F94CD33",
              strokeColor: "#FFF",
              strokeWidth: 2,
              zIndex: 1
            }]
          });
          that.mapCtx.moveToLocation({
            longitude: lng,
            latitude: lat
          });
        } else {
          wx.showToast({
            title: that.data.city + '的边界没有被记录',
            icon: 'none',
            duration: 2000
          })
        }
      }
    })

  });
  return chart;
}

Page({

  /**
   * 页面的初始数据
   */
  data: {
    ec: {
      onInit: initChart
    },
    active: 0,
    polygon: [{
      points: [{
          'longitude': '117.429983',
          'latitude': '40.576129'
        },
        {
          'longitude': '117.410241',
          'latitude': '40.572064'
        },
        {
          'longitude': '117.389903',
          'latitude': '40.562072'
        },
        {
          'longitude': '117.371966',
          'latitude': '40.569639'
        },
        {
          'longitude': '117.354851',
          'latitude': '40.57891'
        },
        {
          'longitude': '117.331035',
          'latitude': '40.575825'
        },
        {
          'longitude': '117.305853',
          'latitude': '40.573348'
        },
        {
          'longitude': '117.276488',
          'latitude': '40.560402'
        },
        {
          'longitude': '117.250484',
          'latitude': '40.548609'
        },
        {
          'longitude': '117.25952',
          'latitude': '40.522479'
        },
        {
          'longitude': '117.240532',
          'latitude': '40.51636'
        },
        {
          'longitude': '117.212699',
          'latitude': '40.509815'
        },
        {
          'longitude': '117.222311',
          'latitude': '40.488807'
        },
        {
          'longitude': '117.237245',
          'latitude': '40.468792'
        },
        {
          'longitude': '117.252163',
          'latitude': '40.448113'
        },
        {
          'longitude': '117.245579',
          'latitude': '40.424854'
        },
        {
          'longitude': '117.236127',
          'latitude': '40.402627'
        },
        {
          'longitude': '117.226842',
          'latitude': '40.378738'
        },
        {
          'longitude': '117.243221',
          'latitude': '40.368144'
        },
        {
          'longitude': '117.26073',
          'latitude': '40.337217'
        },
        {
          'longitude': '117.272546',
          'latitude': '40.3283'
        },
        {
          'longitude': '117.274342',
          'latitude': '40.308826'
        },
        {
          'longitude': '117.29314',
          'latitude': '40.29569'
        },
        {
          'longitude': '117.294974',
          'latitude': '40.279895'
        },
        {
          'longitude': '117.325547',
          'latitude': '40.285485'
        },
        {
          'longitude': '117.337958',
          'latitude': '40.265426'
        },
        {
          'longitude': '117.345527',
          'latitude': '40.235851'
        },
        {
          'longitude': '117.392795',
          'latitude': '40.223428'
        },
        {
          'longitude': '117.387829',
          'latitude': '40.203413'
        },
        {
          'longitude': '117.397439',
          'latitude': '40.192797'
        },
        {
          'longitude': '117.377026',
          'latitude': '40.176323'
        },
        {
          'longitude': '117.353029',
          'latitude': '40.169679'
        },
        {
          'longitude': '117.345783',
          'latitude': '40.135331'
        },
        {
          'longitude': '117.297431',
          'latitude': '40.120664'
        },
        {
          'longitude': '117.256479',
          'latitude': '40.113298'
        },
        {
          'longitude': '117.250314',
          'latitude': '40.116254'
        },
        {
          'longitude': '117.235853',
          'latitude': '40.108279'
        },
        {
          'longitude': '117.224419',
          'latitude': '40.097646'
        },
        {
          'longitude': '117.211145',
          'latitude': '40.09653'
        },
        {
          'longitude': '117.213527',
          'latitude': '40.085103'
        },
        {
          'longitude': '117.189487',
          'latitude': '40.082694'
        },
        {
          'longitude': '117.156241',
          'latitude': '40.078323'
        },
        {
          'longitude': '117.106961',
          'latitude': '40.071935'
        },
        {
          'longitude': '117.0717',
          'latitude': '40.06793'
        },
        {
          'longitude': '117.034243',
          'latitude': '40.04346'
        },
        {
          'longitude': '116.990489',
          'latitude': '40.037259'
        },
        {
          'longitude': '116.939083',
          'latitude': '40.045991'
        },
        {
          'longitude': '116.913919',
          'latitude': '40.052594'
        },
        {
          'longitude': '116.860929',
          'latitude': '40.049366'
        },
        {
          'longitude': '116.811927',
          'latitude': '40.032235'
        },
        {
          'longitude': '116.77378',
          'latitude': '39.952569'
        },
        {
          'longitude': '116.812367',
          'latitude': '39.888829'
        },
        {
          'longitude': '116.855089',
          'latitude': '39.854856'
        },
        {
          'longitude': '116.875953',
          'latitude': '39.843288'
        },
        {
          'longitude': '116.928475',
          'latitude': '39.813081'
        },
        {
          'longitude': '116.949441',
          'latitude': '39.779539'
        },
        {
          'longitude': '116.899586',
          'latitude': '39.758761'
        },
        {
          'longitude': '116.907163',
          'latitude': '39.730831'
        },
        {
          'longitude': '116.893849',
          'latitude': '39.695878'
        },
        {
          'longitude': '116.895166',
          'latitude': '39.674966'
        },
        {
          'longitude': '116.851402',
          'latitude': '39.652838'
        },
        {
          'longitude': '116.805113',
          'latitude': '39.614337'
        },
        {
          'longitude': '116.711701',
          'latitude': '39.618635'
        },
        {
          'longitude': '116.723946',
          'latitude': '39.592712'
        },
        {
          'longitude': '116.638357',
          'latitude': '39.603391'
        },
        {
          'longitude': '116.569365',
          'latitude': '39.612282'
        },
        {
          'longitude': '116.523207',
          'latitude': '39.585567'
        },
        {
          'longitude': '116.508366',
          'latitude': '39.55179'
        },
        {
          'longitude': '116.464587',
          'latitude': '39.531624'
        },
        {
          'longitude': '116.407122',
          'latitude': '39.511208'
        },
        {
          'longitude': '116.448891',
          'latitude': '39.464889'
        },
        {
          'longitude': '116.436846',
          'latitude': '39.445694'
        },
        {
          'longitude': '116.362771',
          'latitude': '39.455645'
        },
        {
          'longitude': '116.340658',
          'latitude': '39.455393'
        },
        {
          'longitude': '116.306448',
          'latitude': '39.488966'
        },
        {
          'longitude': '116.283089',
          'latitude': '39.493581'
        },
        {
          'longitude': '116.246637',
          'latitude': '39.525714'
        },
        {
          'longitude': '116.236531',
          'latitude': '39.566603'
        },
        {
          'longitude': '116.192655',
          'latitude': '39.587276'
        },
        {
          'longitude': '116.139106',
          'latitude': '39.571331'
        },
        {
          'longitude': '116.105834',
          'latitude': '39.572187'
        },
        {
          'longitude': '116.032869',
          'latitude': '39.574614'
        },
        {
          'longitude': '116.001611',
          'latitude': '39.577964'
        },
        {
          'longitude': '115.97827',
          'latitude': '39.591583'
        },
        {
          'longitude': '115.932402',
          'latitude': '39.587358'
        },
        {
          'longitude': '115.913456',
          'latitude': '39.578239'
        },
        {
          'longitude': '115.877529',
          'latitude': '39.54863'
        },
        {
          'longitude': '115.824179',
          'latitude': '39.532717'
        },
        {
          'longitude': '115.812499',
          'latitude': '39.509927'
        },
        {
          'longitude': '115.762425',
          'latitude': '39.515146'
        },
        {
          'longitude': '115.752499',
          'latitude': '39.515224'
        },
        {
          'longitude': '115.742943',
          'latitude': '39.532292'
        },
        {
          'longitude': '115.738603',
          'latitude': '39.544658'
        },
        {
          'longitude': '115.722479',
          'latitude': '39.543705'
        },
        {
          'longitude': '115.720186',
          'latitude': '39.554704'
        },
        {
          'longitude': '115.695303',
          'latitude': '39.57035'
        },
        {
          'longitude': '115.69438',
          'latitude': '39.582759'
        },
        {
          'longitude': '115.659658',
          'latitude': '39.602846'
        },
        {
          'longitude': '115.639719',
          'latitude': '39.603396'
        },
        {
          'longitude': '115.598483',
          'latitude': '39.598721'
        },
        {
          'longitude': '115.545242',
          'latitude': '39.618646'
        },
        {
          'longitude': '115.521068',
          'latitude': '39.618851'
        },
        {
          'longitude': '115.494824',
          'latitude': '39.649812'
        },
        {
          'longitude': '115.485928',
          'latitude': '39.664923'
        },
        {
          'longitude': '115.489916',
          'latitude': '39.682282'
        },
        {
          'longitude': '115.498924',
          'latitude': '39.696574'
        },
        {
          'longitude': '115.488929',
          'latitude': '39.728891'
        },
        {
          'longitude': '115.468293',
          'latitude': '39.740346'
        },
        {
          'longitude': '115.435564',
          'latitude': '39.762027'
        },
        {
          'longitude': '115.443798',
          'latitude': '39.785482'
        },
        {
          'longitude': '115.488695',
          'latitude': '39.796985'
        },
        {
          'longitude': '115.518315',
          'latitude': '39.789453'
        },
        {
          'longitude': '115.556852',
          'latitude': '39.797349'
        },
        {
          'longitude': '115.557176',
          'latitude': '39.819286'
        },
        {
          'longitude': '115.524287',
          'latitude': '39.835958'
        },
        {
          'longitude': '115.522336',
          'latitude': '39.859993'
        },
        {
          'longitude': '115.510019',
          'latitude': '39.881472'
        },
        {
          'longitude': '115.510714',
          'latitude': '39.909483'
        },
        {
          'longitude': '115.49345',
          'latitude': '39.920351'
        },
        {
          'longitude': '115.428247',
          'latitude': '39.949617'
        },
        {
          'longitude': '115.450313',
          'latitude': '39.993044'
        },
        {
          'longitude': '115.487907',
          'latitude': '40.043359'
        },
        {
          'longitude': '115.552337',
          'latitude': '40.079588'
        },
        {
          'longitude': '115.594436',
          'latitude': '40.109409'
        },
        {
          'longitude': '115.655448',
          'latitude': '40.130939'
        },
        {
          'longitude': '115.708689',
          'latitude': '40.134292'
        },
        {
          'longitude': '115.768918',
          'latitude': '40.166756'
        },
        {
          'longitude': '115.838443',
          'latitude': '40.149052'
        },
        {
          'longitude': '115.860825',
          'latitude': '40.187364'
        },
        {
          'longitude': '115.890604',
          'latitude': '40.225047'
        },
        {
          'longitude': '115.932071',
          'latitude': '40.254778'
        },
        {
          'longitude': '115.955123',
          'latitude': '40.27942'
        },
        {
          'longitude': '115.929239',
          'latitude': '40.321053'
        },
        {
          'longitude': '115.885256',
          'latitude': '40.357022'
        },
        {
          'longitude': '115.796877',
          'latitude': '40.432525'
        },
        {
          'longitude': '115.780393',
          'latitude': '40.462374'
        },
        {
          'longitude': '115.743079',
          'latitude': '40.494964'
        },
        {
          'longitude': '115.78155',
          'latitude': '40.555973'
        },
        {
          'longitude': '115.874953',
          'latitude': '40.595756'
        },
        {
          'longitude': '115.950436',
          'latitude': '40.609547'
        },
        {
          'longitude': '116.005106',
          'latitude': '40.584098'
        },
        {
          'longitude': '116.040319',
          'latitude': '40.601176'
        },
        {
          'longitude': '116.122076',
          'latitude': '40.629996'
        },
        {
          'longitude': '116.164764',
          'latitude': '40.663636'
        },
        {
          'longitude': '116.202377',
          'latitude': '40.730138'
        },
        {
          'longitude': '116.244192',
          'latitude': '40.787822'
        },
        {
          'longitude': '116.288948',
          'latitude': '40.764159'
        },
        {
          'longitude': '116.346941',
          'latitude': '40.772281'
        },
        {
          'longitude': '116.436989',
          'latitude': '40.767046'
        },
        {
          'longitude': '116.439898',
          'latitude': '40.815031'
        },
        {
          'longitude': '116.371274',
          'latitude': '40.872967'
        },
        {
          'longitude': '116.358203',
          'latitude': '40.936102'
        },
        {
          'longitude': '116.385242',
          'latitude': '40.922339'
        },
        {
          'longitude': '116.41394',
          'latitude': '40.899762'
        },
        {
          'longitude': '116.450461',
          'latitude': '40.901262'
        },
        {
          'longitude': '116.475691',
          'latitude': '40.90869'
        },
        {
          'longitude': '116.456294',
          'latitude': '40.944586'
        },
        {
          'longitude': '116.453553',
          'latitude': '40.975147'
        },
        {
          'longitude': '116.480355',
          'latitude': '40.980492'
        },
        {
          'longitude': '116.512532',
          'latitude': '40.974894'
        },
        {
          'longitude': '116.539815',
          'latitude': '40.989252'
        },
        {
          'longitude': '116.572139',
          'latitude': '40.989313'
        },
        {
          'longitude': '116.603032',
          'latitude': '40.976683'
        },
        {
          'longitude': '116.614901',
          'latitude': '41.003575'
        },
        {
          'longitude': '116.619962',
          'latitude': '41.031584'
        },
        {
          'longitude': '116.630684',
          'latitude': '41.060654'
        },
        {
          'longitude': '116.663284',
          'latitude': '41.047989'
        },
        {
          'longitude': '116.695596',
          'latitude': '41.032016'
        },
        {
          'longitude': '116.683282',
          'latitude': '40.998666'
        },
        {
          'longitude': '116.679597',
          'latitude': '40.977504'
        },
        {
          'longitude': '116.689666',
          'latitude': '40.953071'
        },
        {
          'longitude': '116.708333',
          'latitude': '40.934033'
        },
        {
          'longitude': '116.716493',
          'latitude': '40.920136'
        },
        {
          'longitude': '116.725954',
          'latitude': '40.902168'
        },
        {
          'longitude': '116.753018',
          'latitude': '40.891321'
        },
        {
          'longitude': '116.790671',
          'latitude': '40.865437'
        },
        {
          'longitude': '116.815216',
          'latitude': '40.848415'
        },
        {
          'longitude': '116.859316',
          'latitude': '40.832146'
        },
        {
          'longitude': '116.881708',
          'latitude': '40.814966'
        },
        {
          'longitude': '116.89643',
          'latitude': '40.794149'
        },
        {
          'longitude': '116.905796',
          'latitude': '40.777045'
        },
        {
          'longitude': '116.923745',
          'latitude': '40.753248'
        },
        {
          'longitude': '116.946648',
          'latitude': '40.726919'
        },
        {
          'longitude': '116.968577',
          'latitude': '40.707611'
        },
        {
          'longitude': '117.005506',
          'latitude': '40.694859'
        },
        {
          'longitude': '117.043056',
          'latitude': '40.699561'
        },
        {
          'longitude': '117.095816',
          'latitude': '40.705679'
        },
        {
          'longitude': '117.137489',
          'latitude': '40.69746'
        },
        {
          'longitude': '117.182041',
          'latitude': '40.695682'
        },
        {
          'longitude': '117.219999',
          'latitude': '40.689235'
        },
        {
          'longitude': '117.262235',
          'latitude': '40.680261'
        },
        {
          'longitude': '117.304465',
          'latitude': '40.659554'
        },
        {
          'longitude': '117.337516',
          'latitude': '40.664122'
        },
        {
          'longitude': '117.378183',
          'latitude': '40.678804'
        },
        {
          'longitude': '117.436233',
          'latitude': '40.683512'
        },
        {
          'longitude': '117.481428',
          'latitude': '40.677934'
        },
        {
          'longitude': '117.509722',
          'latitude': '40.663953'
        },
        {
          'longitude': '117.500968',
          'latitude': '40.641889'
        },
        {
          'longitude': '117.460319',
          'latitude': '40.652761'
        },
        {
          'longitude': '117.431403',
          'latitude': '40.625649'
        },
        {
          'longitude': '117.429983',
          'latitude': '40.576129'
        }
      ],
      fillColor: "#4F94CD33",
      strokeColor: "#FFF",
      strokeWidth: 2,
      zIndex: 1
    }],
    longitude: 116.405285,
    latitude: 39.904989,
    scale: 7,
    show_location: true,
    report_array: []
  },


  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

    // 参考 https://developers.weixin.qq.com/community/develop/doc/0008446e730000be6a0967b5a51800

    this.mapCtx = wx.createMapContext('myMap')
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function (options) {
    this.getTabBar().init();
    var report_array = new Array();
    console.log(app.globalData.openid, app.globalData.local_report)
    // 如果有openid，那就不看local_report了
    if (app.globalData.openid) {
      report_array = app.globalData.db_array;
    }
    // 如果没有openid，看看有没有local_report
    else if (app.globalData.local_report) {
      report_array[0] = app.globalData.local_report;
    }
    console.log('报告列表', report_array);
    this.setData({
      report_array: report_array
    })
    console.log('真的有报告吗？？', report_array)
    // 如果没有报告，就返回
    if (report_array.length == 0) {
      var data = [{
        value: 100,
        name: '暂无图表'
      }];
    } else {
      this.setData({
        report_choose: report_array[0],
        report_choose_index: 0
      })
      // 如果有报告，就选择默认第一个为展示的报告
      var data = []
      var report_choose = this.data.report_choose.report;
      console.log('要开始循环', report_choose);
      var index = 0;
      for (var key in report_choose) {
        var value = Math.floor(parseFloat(report_choose[key].prob) * 10000) / 100;
        data[index] = {
          value: value,
          name: report_choose[key].city + value.toString() + '%'
        }
        index += 1;
        if (index >= 5) {
          break
        }
      }
      console.log(data)
    }

    // 重绘图表
    var option = {
      backgroundColor: "#ffffff",
      series: [{
        label: {
          normal: {
            fontSize: 14
          }
        },
        type: 'pie',
        center: ['50%', '50%'],
        radius: ['20%', '40%'],
        data: data
      }]
    };
    // onshow重绘
    try {
      console.log('onshow重绘');
      chart.setOption(option);
      console.log('onshow重绘成功')
    } catch (err) {
      console.log('onshow重绘失败', err)
    }


  },
  onGridClick(e) {
    console.log(e);
  },
  onCellOpen(e) {
    console.log(e);
  },
  onCellClose(e) {
    console.log(e);
    const {
      position,
      instance,
      name
    } = e.detail;
    var report_choose_index = 0;
    for (var index in this.data.report_array) {
      if (this.data.report_array[index]._id == name) {
        report_choose_index = index;
      }
    }
    this.setData({
      report_choose: this.data.report_array[report_choose_index],
      report_choose_index: report_choose_index
    })
    instance.close()

  },
  onTabChange(e) {
    console.log(e);
    var report_array = this.data.report_array;
    // 如果没有报告，就返回
    if (report_array.length == 0) {
      return;
    }
    // 如果有报告，就选择默认第一个为展示的报告
    var data = []
    var report_choose = this.data.report_choose.report;
    console.log('要开始循环', report_choose);
    var index = 0;
    for (var key in report_choose) {
      var value = Math.floor(parseFloat(report_choose[key].prob) * 10000) / 100;
      data[index] = {
        value: value,
        name: report_choose[key].city + value.toString() + '%'
      }
      index += 1;
      if (index >= 5) {
        break
      }
    }
    console.log(data)

    var option = {
      backgroundColor: "#ffffff",
      series: [{
        label: {
          normal: {
            fontSize: 14
          }
        },
        type: 'pie',
        center: ['50%', '50%'],
        radius: ['20%', '40%'],
        data: data
      }]
    };
    // 在切换tab的时候重绘
    console.log('在切换tab的时候重绘');
    chart.setOption(option);


  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },
  onLoad() {
    // 参考野路子，让外部定义的函数也能够获取到this指针
    // https://developers.weixin.qq.com/community/develop/doc/000c22040f0ab8a64bc88b12853c00
    that = this; //页外保存page指针
  },
  onUnload() {
    that = null; //记得释放
  }


})